<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<script type="text/javascript"
	src="${pageContext.request.contextPath }/script/jquery-1.10.2.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath }/script/jquery.validate.js"></script>
<script type="text/javascript">
	$(function() {
		$("#form").validate({
			rules:{
				"photo.title":{
					required:true
				},
				"photo.description":{
					required:true
				}
			},
			messages:{
				"photo.title":{
					required:"请输入相片标题"
				},
				"photo.description":{
					required:"请输入相片描述"
				}
			}
		});
	});
</script>
<style>
#info dt img {
	width: 200px;
	height: 150px;
}

</style>

<c:if test="${not empty photoList }">
<div id="info">
	<h3>我的照片</h3>
	<c:forEach items="${photoList }" var="p">
		<dl>
			<dt>
				<img
					src="${pageContext.request.contextPath }/UserFiles/Albums/${p.user.id }/${p.album.id }/Thumbnail/${p.filePath}">
			</dt>
			<dd>${p.title }</dd>
		</dl>
	</c:forEach>
</div>
</c:if>
<div class="clearBoth"></div>
<div id="addAlbum">
	<h3>新增照片</h3>
	<form action="addPhoto" id="form" method="post"
		enctype="multipart/form-data">
		<input type="hidden" value="${albumId }" name="albumId" />
		<table>
			<tr>
				<td>相片名称：</td>
				<td><input type="text" name="photo.title" /></td>
			</tr>
			<tr>
				<td>相片描述：</td>
				<td><textarea rows="5" cols="30" name="photo.description"></textarea></td>
			</tr>
			<tr>
				<td>上传：</td>
				<td><input type="file" name="cover" /><label class="error">${msg }</label></td>
			</tr>
			<tr>
				<td></td>
				<td><input type="submit" id="click" value="上传相片" /></td>
			</tr>
		</table>
	</form>
</div>